<template>
  <div class='serve-detail first-box'>
    <div class="tab-box">
      <Tab :listData="tabData" :selected="selectedIndex" :className="{padding100:true}"></Tab>
    </div>
    <Filters @filterTime="filterResults"></Filters>
    <List :listData="serveListData" :hasmore="hasmore" :pullup="pullup" :selectedIndex="selectedIndex"></List>
  </div>
</template>
<script>
import Tab from '../../common/tab'
import Filters from '../../common/filters'
import List from './common/serveList'
export default {
  components: {Tab,Filters,List},
  name: "",
  data() {
    return {
      tabData:[
        {
          name:"检测记录",
          click:this.changeTab,
          type:0
        },{
          name:"维修记录",
          click:this.changeTab,
          type:1
        }
      ],
      selectedIndex:0,//默认选中
      pageInfo:{
        page:1
      },

      serveListData:[
        {
          id:1,
          name:"常规检查",
          time:"2018-8-14 10:21"
        },{
          id:2,
          name:"常规检查",
          time:"2018-8-14 10:21"
        },
      ],

      hasmore:false,
    };
  },
  methods: {
    changeTab(item){
      this.selectedIndex=item.type
      var url=""
      if(item.type==0){
        url="trafficReport/getService.do"
      }else{
        url="trafficReport/getInfo.do"
      }

      this.serveListData=[]
      
      this.getList(url)
    },


    // 下拉刷新方法回调
    pullup(func){
      if(this.hasmore){
        this.pageInfo.page++
         _g.orderList([this.getList,func])
         return
      }
    },
    getList(url,val){
      var params={
        vehicleId:sessionStorage.getItem("detailId")=="暂无"?"":sessionStorage.getItem("detailId"),
        serviceTimeStart:(val&&val.time)?val.time[0]:"",
        serviceTimeEnd:(val&&val.time)?val.time[1]:"",
        search:val?val.search:"",
      }

      // console.log(params,"test")
      if(!params.vehicleId){
        var that = this
        this.$store.state.dialogs.alert.content="暂时没有相关的车辆信息"
        this.$store.state.dialogs.alert.OK=function(){
          that.$router.go(-1)
        }
        this.$store.state.dialogs.alert.show=true
        return 
      }

      _g.apiPost(url,params).then(res=>{
        this.hasmore=res.data.hasNextPage
        var goal=[]
        res.data.list.forEach(ele => {
            goal.push({
              id:ele.id,
              name:ele.detectionName||ele.name,
              time:ele.serviceTimeStr||ele.detectionTimeStr,
            })
        });
        this.$set(this,"serveListData",this.serveListData.concat(goal))
      })
    },
    // 搜索
    filterResults(val){
      var url=this.selectedIndex==0?"trafficReport/getService.do":"trafficReport/getInfo.do"
      this.serveListData=[]
      this.getList(url,val)
    }
  },
  created() {
    this.changeTab({type:0})
  }
};
</script>
<style lang="scss" scoped>
.serve-detail {
  
  .tab-box{
    background-color: #f2f2f2;
    padding-bottom: 5px;
  }

  .padding100{
    padding-left: 100px;
    padding-right: 100px;
  }
}
</style>